<template>
	<div class="iInfo" element-loading-text="加载中" v-loading="loading">
		<div class="flex">
			<div class="lumpBox">
				<div class="Lbox-form">
					<el-form :inline="true">
						<el-form-item label="筛选:"><el-input placeholder="请输入项目名称" clearable></el-input></el-form-item>
						<el-form-item><el-button icon="el-icon-search" type="primary">查询</el-button></el-form-item>
					</el-form>
				</div>
				<div class="Lbox-title"><h2>项目管理</h2></div>
				<div class="Lbox-content">
					<el-table :data="list" :max-height="table_height" border default-expand-all>
						<el-table-column align="center" label="项目编号" prop="created_at">0689</el-table-column>
						<el-table-column align="center" label="项目名称" prop="created_at">项目管理后台</el-table-column>
						<el-table-column align="center" label="项目分类" prop="created_at">内部</el-table-column>
						<el-table-column align="center" label="项目类型" prop="created_at">软件</el-table-column>
						<el-table-column align="center" label="客户名称" prop="created_at">北京迪文</el-table-column>
						<el-table-column align="center" label="负责人" prop="created_at">刘亚俊</el-table-column>
						<el-table-column align="center" label="期望样机时间" prop="created_at" min-width="100">2021-06-01</el-table-column>
						<el-table-column align="center" label="项目时间" prop="created_at" min-width="190">2021-05-01 ~ 2021-06-30</el-table-column>
						<el-table-column align="center" label="未来三个月的业绩" prop="created_at">999999</el-table-column>
						<el-table-column align="center" label="项目状态" prop="created_at" width="182">
							<template slot-scope="scope">
								<div>待申领/驳回</div>
							</template>
						</el-table-column>
						<el-table-column align="center" label="创建人" prop="created_at">李强</el-table-column>
						<el-table-column align="center" label="操作">
							<template slot-scope="scope">
								<el-button @click="$router.push({ path: '/manage_details', query: { head: encodeURI('项目管理后台'), projectId: scope.row.id } })" plain size="small" type="primary">详情</el-button>
							</template>
						</el-table-column>
					</el-table>
					<el-pagination :current-page="page" :total="total" @current-change="currentChange" class="Lpage" layout="prev,pager,next"></el-pagination>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	name: 'manage',
	data() {
		return {
			list: [{id: 1}, {id: 2}, {id: 3}],
			page: 1,
			total: 1,
			table_height: 0,
			loading: false
		};
	},
	components: {},
	created() {
		this.$emit('pass', '/manage');
	},
	mounted() {
		this.$nextTick(() => {
			this.table_height = $('.el-main').height() - 266;
		});
	},
	methods: {
		currentChange(num) {}
	}
};
</script>
<style lang="scss" scoped>
.mark {
	display: flex;
	align-items: center;
	li {
		margin-left: 16px;
		span {
			width: 12px;
			height: 12px;
			margin-right: 4px;
			display: inline-flex;
		}
		&:nth-of-type(1) {
			margin-left: 0;
		}
	}
}
.state {
	position: relative;
	width: 160px;
	height: 20px;
	background: #ccc;
	p {
		position: absolute;
		width: 100%;
		line-height: 20px;
		text-align: center;
	}
	span {
		font-size: 12px;
		height: 100%;
		display: block;
	}
}
</style>
